<template>
	<view class="service-good-box m-b-25 p-20 bg-white radius-15" v-if="props.data.list.length > 0">
		<view class="title-box">
			<text class="tit">{{ props.data.title }}</text>
			<coreshop-view-more @hanldeClickViewMore="hanldeClickViewMore" />
		</view>

		<view class="card-box" v-for="item, index in props.data.list" :key="index">
			<coreshop-goods-card class="goods-card" :goodsData="hanldeCombinationGoodsData(item)"
				@hanldeClickGoods="hanldeClickGoods">
				<template #goodTag>
					<view class="price-tag-box" @click="hanldeClickGoods(item)">
						<view class="tag-box">
							<text class="tag">限购{{ item.maxBuyNumber }}</text>
							<text class="tag ticke">{{ item.ticketNumber }}张券</text>
						</view>
						<view class="price">
							<text class="symbol">￥</text>
							<text class="num">{{ item.money }}</text>
						</view>
					</view>
				</template>
				<template #goodPrice>
					<view class="price-time">
						<view class="time" v-if="item.openStatus == 1 && item.lastTime > 0"
							@click="hanldeClickGoods(item)">
							<view class="time-tit">仅剩：</view><uv-count-down class="down-box"
								:time="item.lastTime * 1000" format="DD天HH时mm分ss秒"></uv-count-down>
						</view>
						<view class="time" v-if="item.openStatus == 2 && item.lastTime > 0">
							<view class="time-tit">即将开始：</view><uv-count-down class="down-box"
								:time="item.lastTime * 1000" format="DD天HH时mm分ss秒"></uv-count-down>
						</view>
						<view class="btn end" v-if="item.openStatus == 3">已结束</view>
						<view class="btn" v-else @click="hanldeClickGoods(item)">马上抢</view>
					</view>
				</template>
			</coreshop-goods-card>
		</view>
	</view>
</template>
<script setup lang="ts">
	import { handleRouteNavigateTo } from '@/core/utils';

	const props = withDefaults(defineProps<{
		data : any,
	}>(), {
		data: {},
	});

	// 组合商品数据传入组件
	const hanldeCombinationGoodsData = (item : any) => {
		return {
			id: item.id,
			image: item.thumbnail,
			name: item.title,
			brief: item.description,
			price: item.money,
		}
	}

	const hanldeClickViewMore = () => {
		handleRouteNavigateTo('/pages/subpackage/serviceGoods/list/list');
	}

	const hanldeClickGoods = (data : any) => {
		handleRouteNavigateTo(`/pages/subpackage/serviceGoods/detail/detail?id=${data?.id}`)
	}
</script>
<style lang="scss" scoped>
	@import './home-service-good.scss';
</style>